<!--  -->
<template>
  <div v-if="Object.keys(paramInfo).length !== 0">
    <div v-for="(item, index) in paramInfo.rule" :key="index">
			<div v-for="(list, index1) in item" class="flex" :key="index1">
				<div v-for="(listitem, index2) in list" class="rule-list-item" :key="index2">
					{{listitem}}
				</div>
			</div>
		</div>
		<div v-for="(info, index) in paramInfo.info" :key="'info-'+index" class="flex info-list-wrap">
			<div class="info-list-tit">{{info.key}}</div>
			<div>{{info.value}}</div>
		</div>
  </div>
</template>

<script>
export default {
  name: 'DetailParamInfo',
  props: {
    paramInfo:{
      type:Object,
      default() {
        return {}
      }
    }
  },
  data() {
    return {

    }
  },
  // 生命周期 - 创建完成（访问当前this实例）
  created() {

  },
  // 生命周期 - 挂载完成（访问DOM元素）
  mounted() {

  }
}
</script>
<style scoped>
/* @import url(); 引入css类 */
	.params-wrap {
		border-top: 4px solid #ececec;
		border-bottom: 4px solid #ececec;
	}
	.rule-list-item {
		font-size: 12px;
		width: 20%;
		border-bottom: 1px solid #ececec;
		padding: 10px 4px;
	}
	.info-list-wrap {
		font-size: 14px;;
		border-bottom: 1px solid #ececec;
		padding: 10px 4px;
		line-height: 20px;
	}
  .info-list-tit {
    width: 18%;
  }
</style>
